require('../css/data.less');
const baseURL = require('../utils/baseURL.js');
const echarts = require('echarts');

window.onload = function () {
    let back = document.querySelector('header>span');
    let num1 = document.querySelector('.num1')
    let num2 = document.querySelector('.num2')
    let img = document.querySelector('img')
    let totalCalorie = document.querySelector('.totalCalorie')
    back.addEventListener('click', function () {
        location.href = '../mine.html'
    })

    function getMsg() {
        axios.get('/api/user/info').then(function (res) {
            console.log(res.data);
            let data = res.data.data;
            img.src = baseURL + data.imgUrl;
            num1.innerHTML = data.duration;
            num2.innerHTML = data.calorie
            totalCalorie.innerHTML = data.calorie
        })
    }
    getMsg();

    axios.get('/api/exercise').then(function (res) {
        console.log(res.data.data);
        let data1 = res.data
        let data2 = data1.data.days
        let myChart = echarts.init(document.getElementById('main'));
        var myChart1 = echarts.init(document.getElementById('main1'));
        var myChart2 = echarts.init(document.getElementById('main2'));
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '近7天运动时长'
            },
            xAxis: {
                data: [data1.data.days[0].date, data1.data.days[1].date, data1.data.days[2].date, data1.data.days[3].date, data1.data.days[4].date, data1.data.days[5].date, data1.data.days[6].date]
            },
            yAxis: {},
            series: [
                {
                    type: 'bar',
                    data: [data2[0].sumDuration / 60, data2[1].sumDuration / 60, data2[2].sumDuration / 60, data2[3].sumDuration / 60, data2[4].sumDuration / 60, data2[5].sumDuration / 60, data2[6].sumDuration / 60]
                }
            ]
        };
        myChart.setOption(option);
        var option = {
            title: {
                text: '运动分类'
            },
            tooltip: {
                trigger: 'item'
            },
            legend: {
                orient: 'vertical',
                top: '50px',
                left: '20px',
            },
            series: [
                {
                    type: 'pie',
                    label: {
                        show: false
                    },
                    data: [
                        {
                            value: 25,
                            name: '跑步',
                            itemStyle: {
                                color: 'red'
                            }
                        },
                        {
                            value: 35,
                            name: '骑行',
                            itemStyle: {
                                color: 'orange'
                            }
                        },
                        {
                            value: 40,
                            name: '训练',
                            itemStyle: {
                                color: 'pink'
                            }
                        }
                    ]
                }
            ]
        };
        myChart1.setOption(option);

        let exerciseData = data2[0].exerciseData
        run = data2.map(function (item) {
            return item.exerciseData[0].duration / 60
        })
        Cycling = data2.map(function (item) {
            return item.exerciseData[1].duration / 60
        })
        train = data2.map(function (item) {
            return item.exerciseData[2].duration / 60
        })
        var option2 = {
            title: {
                text: '近7天运动分类'
            },
            legend: {
                // orient: 'vertical',
                top: '10px',
                right: '5px',
            },
            xAxis: {

            },
            yAxis: { data: ['A', 'B', 'C', 'D', 'E', 'F', 'G'] },
            series: [
                {
                    name: '跑步',
                    data: run,
                    type: 'bar',
                    stack: 'X',
                    itemStyle: {
                        color: 'lightblue'
                    }
                },
                {
                    name: '骑行',
                    data: Cycling,
                    type: 'bar',
                    stack: 'X',
                    itemStyle: {
                        color: 'crimson'
                    }
                },
                {
                    name: '训练',
                    data: train,
                    type: 'bar',
                    stack: 'X',
                    itemStyle: {
                        color: '#28f02c'
                    }
                }
            ]
        };
        myChart2.setOption(option2);
    })


    // 使用刚指定的配置项和数据显示图表。


}